<template>
  <div class="presentDetail">
    <x-header class="header" :left-options="{showBack: showHeaderBack}" ref="header">赠送酒水详情</x-header>
    <div class="topHolder"></div>
    <card>
      <div class="card-padding state" slot="content">
        <i class="iconfont" :class="[stateClass,stateTextClass]"></i>
        <br/>
        <span class="stateText">状态：<b :class="[stateTextClass]" v-text="stateText"></b></span>
      </div>
    </card>
    <group label-width="6em">
      <cell title="客户名称" :value="presentInfo.CUSTOMER_NAME"></cell>
      <cell title="所在房台号" :value="presentInfo.AREA + ' - ' + presentInfo.NUMBER + '（' + presentInfo.ROOM_PLATFORM_TYPE + '）'"></cell>
      <cell title="订单单号" inline-desc="点击查看已赠送详情" class="number" :value="presentInfo.ORDER_NUMBER" :is-link="showLink" :link="orderLink"></cell>
      <cell title="发起赠送人" :value="presentInfo.PRESENTER + '-' + presentInfo.present_DEPARTMENT"></cell>
      <cell title="赠送类型" :value="getType(presentInfo.TYPE)"></cell>
      <cell title="赠送备注" :value="presentInfo.REMARK"></cell>
    </group>
    <group title="赠送商品列表：">
      <x-table :cell-bordered="false">
        <thead>
          <tr style="background-color: #F7F7F7">
            <th>赠送商品</th>
            <th width="22%">赠送数量</th>
            <th width="32%">金额</th>
          </tr>
        </thead>
        <tbody>
          <tr v-for="(item,index) in presentInfo.DETAILS" :key="index">
            <td v-text="item.NAME"></td>
            <td v-text="item.QUANTITY"></td>
            <td v-text="'¥ ' + formatCurrency(item.ORIGINAL_PRICE) + '元'"></td>
          </tr>
          <tr v-if="JSON.stringify(presentInfo) != '{}' && presentInfo.DETAILS.length <= 0">
            <td colspan="3">
              <div class="listNoItem">暂无赠送明细</div>
            </td>
          </tr>
          <tr>
            <td colspan="3" class="countUp">合计：<span v-text="'¥ ' + formatCurrency(countUp) + '元'"></span> </td>
          </tr>
        </tbody>
      </x-table>
    </group>
    <br/>
  </div>
</template>

<script>
  import {Group, Cell, Card, XTable, numberComma } from 'vux'
  import {getPresentDetail} from "../../api";
  import {message,toDecimal2} from "../../common/util";

  export default {
    name:'presentDetail',
    data(){
      return{
        showHeaderBack:this.GLOBAL.showHeaderBack,
        loadingStatus:true,
        paramPresentId:this.$route.params.presentId,
        presentInfo:{},
        stateText:'',
        stateClass:'',
        stateTextClass:'',
        countUp:0,
        showLink:true,
        orderLink:''
      }
    },
    components:{
      Group,
      Cell,
      Card,
      XTable
    },
    computed:{
    },
    methods:{
      formatCurrency(number){
        return numberComma(toDecimal2(number))
      },
      getState(state){
        switch (state) {
          case 0:this.stateText = '待赠送';this.stateClass = 'icon-dengluchaoshi';this.stateTextClass = 'waiting';break
          case 1:this.stateText = '成功赠送';this.stateClass = 'icon-zengsong1';this.stateTextClass = 'agree';break
          case 2:this.stateText = '不同意赠送';this.stateClass = 'icon-shenhetongguo';this.stateTextClass = 'disagree';break
          default:this.stateText = '无';this.stateClass = '';this.stateTextClass = '';break
        }
      },
      getType(type){
        switch (type) {
          case 0:return '售卖库存';break
          case 1:return '存酒库存';break
          case 2:return '过期酒水';break
          case 3:return '美女台赠送';break
          case 4:return '会员卡赠送';break
          default:return '无类型';break
        }
      }
    },
    mounted(){
      getPresentDetail(this.paramPresentId).then((res)=>{
        if(res.status == 'success'){
          this.presentInfo = res.data
          this.orderLink = {name:'订单详情',params:{orderId:this.presentInfo.ORDER_ID}}
          this.getState(res.data.STATE)
          for(let item of this.presentInfo.DETAILS){
            this.countUp = this.countUp + item.ORIGINAL_PRICE
          }
        }else if(res.status == 'error') {
          message({message:res.msg,type:'error'})
          console.log('getPresentDetail error info:', res.msg)
        }
        this.$store.commit('updateLoadingStatus',{isLoading:false})
      }).catch((err)=>{console.log('getPresentDetail catch info:',err)})
    }
  }
</script>

<style lang="scss" scoped>
  .presentDetail{
    .state{
      text-align: center;
      .iconfont{
        font-size: 5rem;
        &.waiting{color: #ffca10;}
        &.agree{color: #0abd39;}
        &.disagree{color: #ff2623;}
      }
      .stateText{
        display:inline-block;margin-top: 1rem;
        b{
          &.waiting{color: #ffca10;}
          &.agree{color: #0abd39;}
          &.disagree{color: #ff2623;}
        }
      }
    }
    .countUp{text-align: right;padding:1rem 1rem 1rem 0;}
  }
</style>
